<template>
  <div id="tmpl">
			<ul class="mui-table-view">
				<li v-for="item in list" class="mui-table-view-cell mui-media">
					<router-link v-bind="{to:'newsinfo/'+item.id}">
						<img class="mui-media-object mui-pull-left" :src="item.img_url">
						<div class="mui-media-body">
							{{item.title}}
							<p class='mui-ellipsis'>{{item.zhaiyao}}</p>
                            <div>
                                <span>发表日期{{item.add_time | datefmt('YYYY-MM-DD hh:mm:ss')}}</span>
                                <span v-text="'点击量: '+item.click"></span>
                            </div>
						</div>
					</router-link>
				</li>
			</ul>
  </div>
</template>

<script>
import { Toast } from 'mint-ui';
import common from '../../kits/common.js';
export default {
  data(){
      return{
          list:[]
      }
  },
  methods:{
      getData(){
          var url = common.apidomain + '/api/getnewslist';
          this.$http.get(url).then(function(res){
              if(res.body.status != 0 ){
                  Toast(res.body.status);
                  return;
              }
              this.list = res.body.message;
          })
      }
  },
  created(){
      this.getData()
  }
}
</script>

<style scoped>
ul img{
    width: 80px;
    height:80px;
}
.mui-table-view .mui-media-object{
    max-width:80px;
    height:80px;
}
span{
    color:#26a2ff;
    margin-top:1.5em;
    font-size: 14px;
}
span:nth-of-type(1){
    float:left;
}
span:nth-of-type(2){
    float:right;
}
</style>
